<script setup lang="ts">
import * as echarts from "echarts";
import {onMounted, ref} from "vue";
let YearRef = ref();
onMounted(()=>{
  let chart = echarts.init(YearRef.value);
  chart.setOption({
    title: {
      text: '散点图',
      textStyle: {
        color: 'white',
        fontSize: 20
      }
    },
    xAxis:{},
    yAxis:{},
    series: {
      type: 'scatter'
    },
    grid: {
      left: 20,
      bottom: 20,
    }
  })

})
</script>

<template>
<div class="year">
  <div class="title">年度访问总量</div>
  <div class="chart" ref="YearRef"></div>
</div>
</template>

<style scoped lang="scss">
.year{
  flex: 1;
  margin: 10px;
  background-color: #1dc779;
  .title {
    font-size: 20px;
    color: white;
  }
  .year {
    width: 100%;
    height: calc(100% - 30px);
  }
}
</style>